.book-container{
  width: 100%;
  height: 100%;
  background-color: rgb(66, 65, 64);
  display: flex;
  justify-content: center;
  align-items: center;
}


.book-prev {
    position: relative;
    top: 20%;
    right: 250px;
    height: 200px;
    width: 100px;
    user-select: none;
  }
  
  .book-next {
    position: relative;
    top: 20%;
    left: 300px;
    height: 200px;
    width: 100px;
    user-select: none;
  }
  
  .book-img-prev {
    height: 200px;
    width: 100px;
    transform: rotateZ(45deg);
  }
  
  .book-img-prev:hover {
    transform: translate(-50px, 50px);
    transition: 0.5s;
  }
  
  .book-img-next {
    height: 200px;
    width: 100px;
    transform: rotateZ(-45deg);
  }
  
  .book-img-next:hover {
    transform: translate(50px, 50px);
    transition: 0.5s;
  }
  
  .book {
    width: 300px;
    height: 500px;
    position: absolute;
    top: 20%;
    left: 50%;
    transform-style: preserve-3d;
    perspective: 1000px;
    transition: 1s;
  }

  .book-page{
    width: 300px;
    height: 480px;
    position: absolute;
    transform-origin: left;
    background-size: cover;
    transition: 1s;
    z-index: calc(var(--v)*9);
  }